<template>
  <div>
    <el-dialog
      title="创建微项目"
      width="960px"
      :visible.sync="dialogVisible"
      :before-close="handleClose"
      :close-on-click-modal="false"

    >
      <div class="dialogBody">
        <el-form
          :model="params"
          :rules="rules"
          ref="ruleForm"
          label-position="right"
          label-width="110px"
          size="small"
        >
          <el-form-item label="微项目名称：" prop="name">
            <el-input v-model="params.name" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item label="项目内容：" prop="content">
            <el-input
              v-model="params.content"
              placeholder="请输入"
              type="textarea"
              :autosize="{ minRows: 3 }"
            ></el-input>
          </el-form-item>
          <el-form-item label="申请条件：" prop="project_apply_content">
            <el-input
              v-model="params.project_apply_content"
              placeholder="请输入"
              type="textarea"
              :autosize="{ minRows: 3 }"
            ></el-input>
          </el-form-item>
          <el-form-item label="积分数量：" prop="point_num">
            <el-input
              style="width: 200px"
              oninput="value=value.replace(/[^\d]/g, '').replace(/(\d*)(\.?)(\d*).*/, '$1')"
              v-model="params.point_num"
              @blur="params.point_num = $event.target.value"
              placeholder="请输入"
            ></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="handleClose">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit('ruleForm')"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { addMinProject } from "@/api/miniApply.js";
export default {
  name: "",
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      params: {
        name: "",
        content: "",
        project_apply_content: "",
        point_num: "",
      },
      rules: {
        name: [
          { required: true, message: "请输入微项目名称", trigger: "blur" },
        ],
        point_num: [
          { required: true, message: "请输入积分数量", trigger: "blur" },
        ],
      },
    };
  },

  components: {},

  computed: {},

  beforeMount() {},

  mounted() {},

  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
       

          //新增
          addMinProject(this.params).then((res) => {
            if (res.code == 200) {
              this.$message({
                type: "success",
                message: "提交成功",
              });
              this.$emit("handleClose", true);
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    handleClose() {
      this.$emit("handleClose");
    },
  },

  watch: {},
};
</script>
<style lang='scss' scoped>
.dialogBody {
  /deep/.el-input__inner {
    // width: 260px;
  }
}
</style>